import {reactive,toRefs,computed} from 'vue'
function todoHook(){

  let state=reactive({
      txt:"" ,//收集输入框的值
      todoList:[ //列表数据
      
      ],
      doneList:computed(()=>{ //已完成的列表
         let arr=state.todoList.filter(item=>item.isCheck==true)
         return arr
      }),
      noList:computed(()=>{ //未完成的列表
          let arr=state.todoList.filter(item=>item.isCheck==false)
          return arr
      }),
      toAdd(){ //添加方法
            state.todoList.push( {
              id:new Date().getTime(),
              txt:state.txt,//输入框收集的内容
              isCheck:false
            })
            state.txt=""
      },
      toChange(id){//改变完成与未完成的方法
         state.todoList.forEach(item=>{
            if(item.id===id){
              // 将数据取反
              item.isCheck=!item.isCheck
            }
         })
      },
      toDel(id){ //删除一项
          state.todoList.forEach((item,index)=>{
            if(item.id==id){
               state.todoList.splice(index,1)
            }
          })
      }
  })

    return {
      ...toRefs(state)
    }

}
export default todoHook